<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /*
            概念:ES6允许按照一定的模式，从数组或对象中提取值赋值给变量

            意义：更快的从数组或对象提取值

            数组是有序的，所以数组解构是按照顺序的

            语法：let [变量1,变量2,..]  = [val1，val2,..];

        */


        // 1.完全解构
        let [a, b] = [10, 20];
        console.log(a, b);

        // 2.不完全解构
        let [a1, a2] = [10, 20, 30, 40];
        console.log(a1, a2);


        // 3.缺省值(省略)
        let [b1, , b2] = [10, 20, 30, 40];
        console.log(b1, b2);

        // 4.解构失败
        let [c1, c2, c3] = [10, 20];
        console.log(c1, c2, c3); //10 20 undefined

        //5.解构默认值  
        // 可以给变量赋值默认值，解构成功了就是解构出来的值，如果说解构失败（解构出来的值是undefined）就使用默认值
        let [d1, d2 = 1, d3 = 2] = [10, 66];
        console.log(d1, d2, d3);

        let [x1 = 1, x2 = '哈哈'] = [null, undefined];
        console.log(x1, x2); //null '哈哈'


        // 应用
        // 交换值
        let test1 = 10;
        let test2 = 20;

        [test1, test2] = [test2, test1];
        console.log(test1, test2);
    </script>
</body>

</html>